<template>
	<div class="password_rules_wrapper">
		<h4>密码复杂度</h4>
		<el-radio-group v-model="passwordLevel" @change="handlePassLevelChange">
			<el-radio label="1">
				<span>简单</span>
				<p>该级别为6到18位任意字符的密码</p>
			</el-radio>
			<el-radio label="2">
				<span>标准</span>
				<p>该级别为6到18位必须包含数字和大小字母的密码</p>
			</el-radio>
			<el-radio label="3">
				<span>困难</span>
				<p>该级别为12到24位必须包含数字、大小写字母和特殊字符的密码</p>
			</el-radio>
		</el-radio-group>
	</div>
</template>

<script>
import { mapGetters } from 'vuex';
import { updatePasswordRuleSeeting } from '@/api/system/tbSysSite';
export default {
	data() {
		return {
			passwordLevel: ''
		};
	},
	computed: {
		...mapGetters(['siteInfo']),
		configData() {
			if (this.passwordLevel === '1') {
				return { passwordLen1: 6, passwordLen2: 18 };
			} else if (this.passwordLevel === '2') {
				return { passwordLen1: 6, passwordLen2: 18 };
			} else if (this.passwordLevel === '3') {
				return { passwordLen1: 12, passwordLen2: 24 };
			}
		}
	},
	mounted() {
		this.passwordLevel = this.siteInfo.passwordLevel;
	},
	methods: {
		async handlePassLevelChange() {
			let params = { id: this.siteInfo.id, ...this.configData, passwordLevel: this.passwordLevel };
			let result = await updatePasswordRuleSeeting(params).then((res) => res.data);
			if (result.code === '0') {
				this.$message.success('修改密码规则成功');
			} else {
				this.$message.error('修改密码规则失败');
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.password_rules_wrapper {
	padding: 16px;
	.el-radio {
		display: block;
		line-height: 24px;
		padding: 8px 0;
		p {
			color: #999;
			margin-left: 24px;
		}
	}
}
</style>
